<style lang="less" scoped>

  ul{
    font-size:1rem;
    li{
      height: 1.3rem;
      line-height: 1.3rem;
    }
  }

  .pn{
    background-color: #f6f6f6;
    border:1px solid #e5e5e5;
    border-width: 1px 0;
  }

  .margin1rem{
    margin-left: 1rem;
  }
</style>
<template>

  <div>
   <ul :pindex="index"  v-for="(item,index) in pageSet" @dblclick="updateListName">
     <li v-if="item.pageName" class="pn">{{ item.pageName }}  <button @click="showShade" title="添加子节点">+</button></li>
     <template v-if = "item.children.length > 0">
        <li v-for="value in item.children" class="margin1rem">{{ value.pageName }}</li>
    </template>
   </ul>

  </div>

</template>
<script>

export default{
  name: 'list',
  props: {
    pageSet:{
      type:Array
    },
    index:{
      type:Number
    }
  },
  methods: {
    showShade(e){
      this.$store.dispatch('showShade',{
        state:true,
        class:"child",
        pindex:e.target.parentNode.parentNode.getAttribute('pindex')
      });
    },
    //双击修改
    updateListName(e){
      
    }
  }
}

</script>